import React, {FC} from "react";
import {TimerProps, TimerResult} from '../../types/timer'
import HalfHourBlog from '../HalfHourBlog'
import './style.css'

interface WeekAndHalfHourProps extends TimerProps {
	weekKey: string,
	weekName: string,
	timerInfo: TimerResult[],
}

const WeekAndHalfHour: FC<WeekAndHalfHourProps> = (props: WeekAndHalfHourProps) => {
	const {width, themeColor, weekKey, weekName, timerInfo, changeTimer, canBeClear} = props
	return (
		<div className='week_half_hour_container'>
			<div className='week_name'>{weekName}</div>
			{
				new Array(48).fill(0).map((item, index: number) =>
					<HalfHourBlog
						key={index}
						width={width}
						index={index}
						weekKey={weekKey}
						themeColor={themeColor}
						timerInfo={timerInfo}
						changeTimer={changeTimer}
						canBeClear={canBeClear}
					/>)
			}
		</div>
	)
}
export default WeekAndHalfHour